Amazon PayV2決済フロー

Amazon Payが提供する開発者向け情報ページも合わせて参照ください。

都度決済、利用承諾の流れ

決済フロー

都度決済または利用承諾の流れを以下に記載します。

sequenceDiagram お客様->>加盟店様: カート・利用申込画面に進む
(購入・申込処理開始) 加盟店様-->>お客様: 1.カート・利用申込画表示
AmazonPayボタン表示 participant 当サービス お客様->>Amazon: 2.AmazonPayボタンクリック Amazon-->>お客様: Amazonログイン画面表示 Note right of Amazon: Amazonログイン済の場合は省略 お客様->>Amazon: 3.Amazonログイン Amazon-->>お客様: Amazon配送先/お支払い方法選択画面表示 お客様->>Amazon: 4.配送先/お支払い方法選択 Amazon-->>加盟店様: 5.加盟店様確認画面URLにリダイレクト 加盟店様->>当サービス: 6.住所情報取得 当サービス->>Amazon:   Amazon-->>当サービス:   当サービス-->>加盟店様:   加盟店様-->>お客様: 加盟店様確認画面表示 お客様->>Amazon: 7.配送先/お支払い方法の再選択 Amazon-->>加盟店様: 加盟店様確認画面URLにリダイレクト 加盟店様->>当サービス:住所情報取得 当サービス->>Amazon:   Amazon-->>当サービス:   当サービス-->>加盟店様:   加盟店様-->>お客様:決済確認画面表示 お客様->>加盟店様:8.決済・申込ボタン押下 加盟店様->>当サービス:9.取引登録 当サービス-->>加盟店様:   加盟店様->>当サービス: 10.決済実行 当サービス->>Amazon:   Amazon-->>当サービス:   当サービス-->>加盟店様:   加盟店様-->>お客様:   お客様->>当サービス: 11.支払手続き開始 当サービス->>お客様:   お客様->>Amazon: 12.Amazon画面にリダイレクト Amazon-->>当サービス:   当サービス->>Amazon: 13.決済・利用承諾完了処理 Amazon-->>当サービス:   Amazon-->>お客様: お客様宛てご利用通知メール送信 当サービス-->>加盟店様: 結果通知 当サービス-->>お客様: 決済結果戻しURLにリダイレクト お客様->>加盟店様: 14.決済結果受信 加盟店様-->>お客様: 決済・利用申込完了画面表示

フローの説明

  1. 加盟店様はAmazon Payボタンを表示します。
  2. お客様がAmazon Payボタンを押下します。
  3. お客様がAmazonアカウントでログインします。
  4. お客様が決済に使用するクレジットカード、配送先を選択します。
  5. 加盟店様の確認画面に遷移します。
  6. (任意)加盟店様は必要に応じて確認画面に表示する住所情報を取得します。
  7. (任意)お客様が決済に使用するクレジットカード、配送先を選択し直します。
    選択後、再度加盟店様の確認画面に遷移するので、必要に応じて住所情報を取得します。
  8. お客様は決済・利用申込を行います。
  9. 加盟店様は当サービスの取引登録(EntryTranAmazonpay)を行います。
  10. 加盟店様は当サービスの決済実行(ExecTranAmazonpay)を行います。
  11. 加盟店様はお客様を当サービスの支払手続き開始IF(AmazonpayStart)に誘導します。
  12. お客様のブラウザ上から当サービスの支払手続き開始IF(AmazonpayStart)が行われ、Amazon画面を表示します。
  13. 当サービスがAmazonに対して決済・利用承諾完了処理を行います。
  14. 当サービスが加盟店様の決済結果戻しURLに決済・利用申込結果を返却します。
画面遷移イメージ

画面遷移イメージを以下に記載します。

Amazon Payボタン

加盟店様は、Amazonが提供するJavaScriptを利用し、Amazon Payボタンを実装する必要があります。
詳細についてはAmazonの開発者向け情報ページを参照ください。

サンプル

<body>
    <div id="AmazonPayButton"></div>
    <script src="https://static-fe.payments-amazon.com/checkout.js(※1)"></script>
    <script type="text/javascript" charset="utf-8">
        amazon.Pay.renderButton('#AmazonPayButton', {
            // set checkout environment
            merchantId: 'merchant_id(※2)',
            ledgerCurrency: 'JPY(※3)',
            sandbox: true(※4),
            // customize the buyer experience
            checkoutLanguage: 'ja_JP(※5)',
            productType: 'PayAndShip(※6)',
            placement: 'Cart(※7)',
            buttonColor: 'Gold(※8)',
            // configure Create Checkout Session request
            createCheckoutSessionConfig: {
                payloadJSON: payload(※9), // string generated in step 2
                signature: 'xxxx(※10)', // signature generated in step 3
                publicKeyId: 'xxxxxxxxxx(※11)'
            }
        });
    </script>
</body>
            

htmlには下記項目をセットします。

項目名 設定値
(※1)Amazon JavaScript URL Amazon Payボタンを表示するために必要なJavaScriptのURLになります。
(※2)merchantId Amazon出品者IDを設定します。
(※3)ledgerCurrency 決済で使用する通貨コードを設定します。
(※4)sandbox AmazonのSandBox環境に接続する場合はtrue、商用環境に接続する場合はfalseを設定します。
(※5)checkoutLanguage Amazonのページの表示言語を設定します。
(※6)productType Amazonログイン後の形式を設定します。
・配送先を使う場合は「PayAndShip」を設定してください。
・配送先を使わない場合は「PayOnly」を設定してください。
 ※弊社管理画面の設定項目「AmazonPay住所使用フラグ」は
 Amazon Pay V2では適用されませんのでご注意ください。
・ログインのみ行なう場合は「SignIn」を設定してください。
(※7)placement Amazon Payボタンを表示するページを設定します。
(※8)buttonColor Amazon Payボタンの配色を設定します。
(※9)payload 後続の処理に必要な設定文字列を設定します。
弊社管理画面(ショップ管理画面>都度決済>Amazon Pay>設定)にてAmazonPayボタン情報を取得し、
表示されたpayloadを設定してください。
(※10)signature payloadから生成される署名を設定します。
payloadと同様に、表示されたsignatureを設定してください。
(※11)publicKeyId Amazonセラーセントラルに表示されているPublic Key IDを設定してください。

随時決済の流れ

決済フロー

利用承諾後の随時決済の流れを以下に記載します。

sequenceDiagram participant お客様 加盟店様->>当サービス: 1.取引登録 当サービス-->>加盟店様:   加盟店様->>当サービス: 2.決済実行 当サービス->>Amazon: 3.決済処理 Amazon-->>当サービス:   当サービス-->>加盟店様: 結果通知 当サービス-->>加盟店様: 4.結果返却

フローの説明

  1. 加盟店様は当サービスの取引登録(EntryTranAmazonpay)を行います。
  2. 加盟店様は利用承諾時に発行されたAmazonチャージパーミッションIDを指定し、
    当サービスの決済実行(ExecTranAmazonpay)を行います。
  3. 当サービスがAmazonに対して決済処理を行います。
  4. 当サービスが加盟店様に決済結果を返却します。

APB(AdditionalPaymentButton)の流れ

決済フロー

APB利用時の決済の流れを以下に記載します。
なお、APBは都度決済・利用承諾ともに利用可能です。

sequenceDiagram お客様->>加盟店様: カート・利用申込画面に進む
(購入・申込処理開始) 加盟店様-->>お客様: 1.カート・利用申込画表示
AmazonPayボタン表示 participant 当サービス お客様->>加盟店様: 2.AmazonPayボタン押下 加盟店様->>当サービス:3.取引登録 当サービス-->>加盟店様: ; 加盟店様->>当サービス: 4.決済実行 当サービス->>Amazon: ; Amazon-->>当サービス: ; 当サービス-->>加盟店様: ; 加盟店様-->>お客様: ; お客様->>当サービス: 5.支払手続き開始 当サービス->>お客様: ; お客様->>Amazon: Amazonログイン画面表示 Amazon-->>お客様: ; お客様->>Amazon: 6.Amazonログイン Amazon-->>お客様: お支払い方法選択画面表示; お客様->>Amazon: 7.今すぐ支払うボタン押下 Amazon-->>当サービス: ; 当サービス->>Amazon: 8.決済・利用承諾完了処理 Amazon-->>当サービス: ; Amazon-->>お客様: お客様宛てご利用通知メール送信; 当サービス-->>加盟店様: 結果通知 当サービス-->>お客様: 決済結果戻しURLにリダイレクト お客様->>加盟店様: 9.決済結果受信 加盟店様-->>お客様: 決済・利用申込完了画面表示

フローの説明

  1. 加盟店様はAmazon Payボタンを表示します。
  2. お客様がAmazon Payボタンを押下します。
  3. 加盟店様は当サービスの取引登録(EntryTranAmazonpay)を行います。
  4. 加盟店様は当サービスの決済実行(ExecTranAmazonpay)を行います。
  5. 加盟店様はお客様を当サービスの支払手続き開始IF(AmazonpayStart)に誘導します。
  6. お客様がAmazonアカウントでログインします。
  7. お客様が今すぐ支払うボタンを押下します。
  8. 当サービスがAmazonに対して決済・利用承諾完了処理を行います。
  9. 当サービスが加盟店様の決済結果戻しURLに決済・利用申込結果を返却します。
画面遷移イメージ

Amazon Pay V2のAPBの画面遷移イメージは以下です。
通常の画面遷移とは異なり、Amazon Payボタン押下後は注文確認画面に遷移することなく、すぐにお支払いを完了することができます。

Amazon Payボタン

APBでは以下を参考にAmazon Payボタンを描画してください。
通常のAmazon Payボタンとは異なりcreateCheckoutSessionConfigは不要です。

サンプル

<body>
    <div id="AmazonPayButton"></div>
    <script src="https://static-fe.payments-amazon.com/checkout.js(※1)"></script>
    <script type="text/javascript" charset="utf-8">
        var amazonPayButton = amazon.Pay.renderButton('#AmazonPayButton', {
           merchantId: 'merchant_id(※2)',
           ledgerCurrency: 'JPY'(※3),          
           sandbox: true(※4), 
           checkoutLanguage: 'ja_JP'(※5), 
           productType: 'PayAndShip'(※6), 
           placement: 'Cart'(※7),
           buttonColor: 'Gold'(※8)
        });
        amazonPayButton.onClick(function(){
          // 弊社のAPIを呼び出してください。
        });
    </script>
</body>
            

htmlには下記項目をセットします。

項目名 設定値
(※1)Amazon JavaScript URL Amazon Payボタンを表示するために必要なJavaScriptのURLになります。
(※2)merchantId Amazon出品者IDを設定します。
(※3)ledgerCurrency 決済で使用する通貨コードを設定します。
(※4)sandbox AmazonのSandBox環境に接続する場合はtrue、商用環境に接続する場合はfalseを設定します。
(※5)checkoutLanguage Amazonのページの表示言語を設定します。
(※6)productType Amazonログイン後の形式を設定します。
・配送先を使う場合は「PayAndShip」を設定してください。
・配送先を使わない場合は「PayOnly」を設定してください。
(※7)placement Amazon Payボタンを表示するページを設定します。
(※8)buttonColor Amazon Payボタンの配色を設定します。